<template>
  <van-tabbar v-model="cur" active-color="darkred" inactive-color="#666">
    <!-- <van-tabbar-item icon="home-o" to="/home">首页</van-tabbar-item>
    <van-tabbar-item icon="bookmark-o" to="/topic">专题</van-tabbar-item>
    <van-tabbar-item icon="apps-o" to="/category">分类</van-tabbar-item>
    <van-tabbar-item icon="cart-o" to="/cart">购物车</van-tabbar-item>
    <van-tabbar-item icon="user-o" to="/user">我的</van-tabbar-item> -->
    <van-tabbar-item v-for="(item,index) in tabbarIcons" :key="item.text" :to="item.src" :icon="cur==index?item.activeIcon:item.icon">
      {{item.text}}
    </van-tabbar-item>
  </van-tabbar>
</template>

<script>
export default {
  data() {
    return {
      cur: 0,
      tabbarIcons: [
        {
          icon: require("@/assets/tabbar/ic_menu_choice_nor.png"),
          activeIcon: require("@/assets/tabbar/ic_menu_choice_pressed.png"),
          text: "首页",
          src: "/home",
        },
        {
          icon: require("@/assets/tabbar/ic_menu_topic_nor.png"),
          activeIcon: require("@/assets/tabbar/ic_menu_topic_pressed.png"),
          text: "专题",
          src: "/topic",
        },
        {
          icon: require("@/assets/tabbar/ic_menu_sort_nor.png"),
          activeIcon: require("@/assets/tabbar/ic_menu_sort_pressed.png"),
          text: "分类",
          src: "/category",
        },
        {
          icon: require("@/assets/tabbar/ic_menu_shoping_nor.png"),
          activeIcon: require("@/assets/tabbar/ic_menu_shoping_pressed.png"),
          text: "购物车",
          src: "/cart",
        },
        {
          icon: require("@/assets/tabbar/ic_menu_me_nor.png"),
          activeIcon: require("@/assets/tabbar/ic_menu_me_pressed.png"),
          text: "我的",
          src: "/user",
        },
      ],
    };
  },
  computed: {
    active: {
      get() {
        return this.$route.meta.num;
      },
      set() {},
    },
  },
  created() {
    // 初始化时，强制跳回首页
    this.$router.push("/");
  },
  mounted() {},
  methods: {},
};
</script>

<style scoped lang="less">
</style>
